<!-- this is the layout that is being read by PrinceXML -->
<div style="float:left;width:94%;border:thin solid black;padding:3%;height:860px;">
	<div style="float:left;width:100%;height:68px;">
		<span style="float:left;width:68px;height:68px;">
			<img src="/images/BBLogo.png" width="68" height="68" />
		</span>
		<span style="float:left">
			<span style="padding-left:10px;height:68px;display:table-cell;vertical-align:middle;">
				<b>Beagle Brain, Inc</b><br />
			      734.623.9000<br />
			      www.beaglebrain.com
			</span>
		</span>
		<span style="float:right;">
			<span style="height:68px;display:table-cell;vertical-align:middle;">
				<%= Time.now.strftime("%b %d %Y") %><br>
					<%= "R" + @repair_record.id.to_s %>
			</span>
		</span>
	</div>
	<div align="center" style="float:left;width:100%;font-size:15px;height:60px;">
		<b>Repair Confirmation</b>
	</div>
	<div style="float:left;width:100%;height:72px;">
		<span style="float:left">
			<span>
				<b><%= @repair_record.customer_record.fname %>
				<%= @repair_record.customer_record.lname %></b><br />
		          <%- if @repair_record.customer_record.mobile -%>
					<%= content_tag :span , "Cell: " + number_to_phone(@repair_record.customer_record.mobile, :delimiter => ".")   %>
				<%- end -%><br />
		          <%- if @repair_record.customer_record.work -%>
					<%= content_tag :span , "Work: " + number_to_phone(@repair_record.customer_record.work, :delimiter => ".") %>
				<%- end -%><br />
		          <%= content_tag :span, @repair_record.customer_record.street %><br />
		          <%= content_tag :span, @repair_record.customer_record.state + " " + @repair_record.customer_record.zip.to_s %>
			</span>
		</span>
		<span style="float:right">
			<span style="text-align:left;">
			</span>
		</span>
	</div>
	<div style="float:left;width:100%;height:7px;border-top:thin dotted gray;"></div>
	<div style="float:left;width:100%;min-height:180px;height:450px;border-bottom:thin dotted gray;margin-bottom:14px;">
		<div style="float:left;width:100%;min-height:90px;">
			<b>Completed Repair Description</b><br />
	          <%= @repair_record.note %>
		</div>
		<div style="float:left;width:100%;min-height:90px;">
			<br />
	          <%= @repair_record.parts_ordered %>
		</div>
	</div>
	<div style="float:left;width:100%;height:180px;">
		<div style="float:left;width:100%;height:80px;">
		Thank you for using Beagle Brain as your repair service provider. Beagle Brain warrants against hardware issues related to this repair for 90 day, and warrants against  software issues related to this repair for 7 days. <b>By signing below, you agree that the repair description above is complete and accurate and that you have received the items listed in the work authorization.</b>
		</div>
		<div style="float:left;width:100%;height:50px;">
			<span style="height:50px;float:left">
		<b>Customer name: ________________________________________ </b>
			</span>
		</div>
<div style="float:left;width:100%;height:50px;">
			<span style="height:50px;float:left">
		<b>Signature: _______________________________________________ Date __________ </b>
			</span>
		</div>
		
	</div>
</div>
<div style="float:left;width:100%;height:20px;line-height:20px;text-align:center;font-size:9px;">
	Beagle Brain, Inc | 2 Nickels Arcade, Ann Arbor, MI 48104 | 734.623.9000
</div>






<!-- this is the layout that is being read by PrinceXML -->
<div style="float:left;width:94%;border:thin solid black;padding:3%;height:820px;">
	<div style="float:left;width:100%;height:68px;">
		<span style="float:left;width:68px;height:68px;">
			<img src="/images/BBLogo.png" width="68" height="68" />
		</span>
		<span style="float:left">
			<span style="padding-left:10px;height:68px;display:table-cell;vertical-align:middle;">
				<b>Beagle Brain, Inc</b><br />
			      734.623.9000<br />
			      www.beaglebrain.com
			</span>
		</span>
		<span style="float:right;">
			<span style="height:68px;display:table-cell;vertical-align:middle;">
				<%= Time.now.strftime("%b %d %Y") %><br>
					<%= "R" + @repair_record.id.to_s %>
			</span>
		</span>
	</div>
	<div align="center" style="float:left;width:100%;font-size:15px;height:60px;">
		<b>Repair Confirmation</b>
	</div>
	<div style="float:left;width:100%;height:72px;">
		<span style="float:left">
			<span>
				<b><%= @repair_record.customer_record.fname %>
				<%= @repair_record.customer_record.lname %></b><br />
		          <%- if @repair_record.customer_record.mobile -%>
					<%= content_tag :span , "Cell: " + number_to_phone(@repair_record.customer_record.mobile, :delimiter => ".")   %>
				<%- end -%><br />
		          <%- if @repair_record.customer_record.work -%>
					<%= content_tag :span , "Work: " + number_to_phone(@repair_record.customer_record.work, :delimiter => ".") %>
				<%- end -%><br />
		          <%= content_tag :span, @repair_record.customer_record.street %><br />
		          <%= content_tag :span, @repair_record.customer_record.state + " " + @repair_record.customer_record.zip.to_s %>
			</span>
		</span>
		<span style="float:right">
			<span style="text-align:left;">
			</span>
		</span>
	</div>
	<div style="float:left;width:100%;height:7px;border-top:thin dotted gray;"></div>
	<div style="float:left;width:100%;min-height:180px;height:430px;border-bottom:thin dotted gray;margin-bottom:14px;">
		<div style="float:left;width:100%;min-height:90px;">
			<b>Completed Repair Description</b><br />
	          <%= @repair_record.note %>
		</div>
		<div style="float:left;width:100%;min-height:90px;">
			<br />
	          <%= @repair_record.parts_ordered %>
		</div>
	</div>
	<div style="float:left;width:100%;height:150px;">
		<div style="float:left;width:100%;height:80px;">
		Thank you for using Beagle Brain as your repair service provider. Beagle Brain warrants against hardware issues related to this repair for 90 day, and warrants against  software issues related to this repair for 7 days. <b>By signing below, you agree that the repair description above is complete and accurate and that you have received the items left with us listed in the work authorization.</b>
		</div>
		<div style="float:left;width:100%;height:50px;">
			<span style="height:50px;float:left">
		<b>Customer name: ________________________________________ </b>
			</span>
		</div>
<div style="float:left;width:100%;height:50px;">
			<span style="height:50px;float:left">
		<b>Signature: _______________________________________________ Date __________ </b>
			</span>
		</div>
		
	</div>
</div>
<div style="float:left;width:100%;height:20px;line-height:20px;text-align:center;font-size:9px;">
	Beagle Brain, Inc | 2 Nickels Arcade, Ann Arbor, MI 48104 | 734.623.9000
</div>

<div style="float:left;width:100%;height:100px;line-height:100px;text-align:center;font-size:18px;text-transform: uppercase;vertical-align: bottom;font-weight: bold;">
	<%= @repair_record.customer_record.fname %>
				<%= @repair_record.customer_record.lname %>
</div>

